Условное выведение типов: Освоение ключевого слова 'infer' в TypeScript

Система типов TypeScript предлагает мощные инструменты для создания надежного и поддерживаемого кода. Среди этих инструментов условные типы выделяются как универсальный механизм для выражения сложных взаимосвязей между типами. В частности, ключевое слово infer открывает расширенные возможности в рамках условных типов, позволяя осуществлять сложное извлечение и манипулирование типами. В этом исчерпывающем руководстве мы рассмотрим тонкости infer, предоставим практические примеры и идеи, которые помогут вам освоить его использование.

Понимание условных типов

Прежде чем погружаться в infer, крайне важно понять основы условных типов. Условные типы позволяют определять типы, зависящие от условия, подобно тернарному оператору в JavaScript. Синтаксис следует этому шаблону:

            T extends U ? X : Y
            

              
                Copy
              
            
          

Здесь, если тип T совместим с типом U, результирующим типом будет X; в противном случае — Y.

Пример:

            type IsString = T extends string ? true : false;

type StringCheck = IsString; // type StringCheck = true
type NumberCheck = IsString; // type NumberCheck = false
            

              
                Copy
              
            
          

Этот простой пример демонстрирует, как условные типы могут использоваться для определения, является ли тип строкой. Эта концепция распространяется и на более сложные сценарии, открывая путь для ключевого слова infer.

Представляем ключевое слово 'infer'

Ключевое слово infer используется в ветке true условного типа для введения переменной типа, которая может быть выведена из проверяемого типа. Это позволяет вам извлекать определенные части типа и использовать их в результирующем типе.

Синтаксис:

            T extends (infer R) ? X : Y
            

              
                Copy
              
            
          

В этом синтаксисе R — это переменная типа, которая будет выведена из структуры T. Если T соответствует шаблону, R будет содержать выведенный тип, и результирующим типом будет X; в противном случае — Y.

Основные примеры использования 'infer'

1. Выведение возвращаемого типа функции

Распространенный случай использования — выведение возвращаемого типа функции. Этого можно достичь с помощью следующего условного типа:

            type ReturnType any> = T extends (...args: any) => infer R ? R : any;
            

              
                Copy
              
            
          

Объяснение:

• T extends (...args: any) => any: Это ограничение гарантирует, что T является функцией.
• (...args: any) => infer R: Этот шаблон соответствует функции и выводит возвращаемый тип как R.
• R : any: Если T не является функцией, результирующим типом будет any.

Пример:

            function greet(name: string): string {
  return `Hello, ${name}!`;
}

type GreetingReturnType = ReturnType; // type GreetingReturnType = string

function calculate(a: number, b: number): number {
  return a + b;
}

type CalculateReturnType = ReturnType; // type CalculateReturnType = number

            

              
                Copy
              
            
          

Этот пример демонстрирует, как ReturnType успешно извлекает возвращаемые типы функций greet и calculate.

2. Выведение типа элемента массива

Другой частый случай использования — извлечение типа элемента массива:

            type ElementType = T extends (infer U)[] ? U : never;
            

              
                Copy
              
            
          

Объяснение:

• T extends (infer U)[]: Этот шаблон соответствует массиву и выводит тип элемента как U.
• U : never: Если T не является массивом, результирующим типом будет never.

Пример:

            type StringArrayElement = ElementType; // type StringArrayElement = string
type NumberArrayElement = ElementType; // type NumberArrayElement = number
type MixedArrayElement = ElementType<(string | number)[]>; // type MixedArrayElement = string | number

type NotAnArray = ElementType; // type NotAnArray = never
            

              
                Copy
              
            
          

Это показывает, как ElementType корректно выводит тип элемента для различных типов массивов.

Продвинутое использование 'infer'

1. Выведение параметров функции

Подобно выведению возвращаемого типа, вы можете вывести параметры функции, используя infer и кортежи:

            type Parameters any> = T extends (...args: infer P) => any ? P : never;
            

              
                Copy
              
            
          

Объяснение:

• T extends (...args: any) => any: Это ограничение гарантирует, что T является функцией.
• (...args: infer P) => any: Этот шаблон соответствует функции и выводит типы параметров как кортеж P.
• P : never: Если T не является функцией, результирующим типом будет never.

Пример:

            function logMessage(message: string, level: 'info' | 'warn' | 'error'): void {
  console.log(`[${level.toUpperCase()}] ${message}`);
}

type LogMessageParams = Parameters; // type LogMessageParams = [message: string, level: "info" | "warn" | "error"]

function processData(data: any[], callback: (item: any) => void): void {
  data.forEach(callback);
}

type ProcessDataParams = Parameters; // type ProcessDataParams = [data: any[], callback: (item: any) => void]
            

              
                Copy
              
            
          

Parameters извлекает типы параметров в виде кортежа, сохраняя порядок и типы аргументов функции.

2. Извлечение свойств из типа объекта

infer также можно использовать для извлечения определенных свойств из типа объекта. Это требует более сложного условного типа, но открывает возможности для мощных манипуляций с типами.

            type PickByType = {
  [K in keyof T as T[K] extends U ? K : never]: T[K];
};
            

              
                Copy
              
            
          

Объяснение:

• K in keyof T: Это итерирует по всем ключам типа T.
• T[K] extends U ? K : never: Этот условный тип проверяет, является ли тип свойства с ключом K (т.е. T[K]) совместимым с типом U. Если да, ключ K включается в результирующий тип; в противном случае он исключается с помощью never.
• Вся конструкция создает новый тип объекта только со свойствами, типы которых расширяют U.

Пример:

            interface Person {
  name: string;
  age: number;
  city: string;
  country: string;
}


type StringProperties = PickByType; // type StringProperties = { name: string; city: string; country: string; }

type NumberProperties = PickByType; // type NumberProperties = { age: number; }

            

              
                Copy
              
            
          

PickByType позволяет вам создать новый тип, содержащий только те свойства из существующего типа, которые соответствуют определенному типу.

3. Выведение вложенных типов

infer можно использовать в цепочках и вкладывать для извлечения типов из глубоко вложенных структур. Например, рассмотрим извлечение типа самого внутреннего элемента вложенного массива.

            type DeepArrayElement = T extends (infer U)[] ? DeepArrayElement : T;
            

              
                Copy
              
            
          

            type NestedStringArray = string[][][];
type DeepString = DeepArrayElement; // type DeepString = string

type MixedNestedArray = (number | string)[][][][];
type DeepMixed = DeepArrayElement; // type DeepMixed = string | number

type RegularNumber = DeepArrayElement; // type RegularNumber = number
            

              
                Copy
              
            
          

            type EventMap = {
  'data': { value: string };
  'error': { message: string };
};

type EventName = keyof T;

type EventData> = T[K];

type EventHandler> = (data: EventData) => void;

class EventEmitter {
  private listeners: { [K in EventName]?: EventHandler[] } = {};

  on>(event: K, handler: EventHandler): void {
    if (!this.listeners[event]) {
      this.listeners[event] = [];
    }
    this.listeners[event]!.push(handler);
  }

  emit>(event: K, data: EventData): void {
    this.listeners[event]?.forEach(handler => handler(data));
  }
}


const emitter = new EventEmitter();

emitter.on('data', (data) => {
  console.log(`Received data: ${data.value}`);
});

emitter.on('error', (error) => {
  console.error(`An error occurred: ${error.message}`);
});

emitter.emit('data', { value: 'Hello, world!' });

emitter.emit('error', { message: 'Something went wrong.' });

            

              
                Copy
              
            
          

            type Action = P extends undefined
  ? { type: T }
  : { type: T; payload: P };

type Reducer> = (state: S, action: A) => S;

// Example Actions
type IncrementAction = Action<'INCREMENT'>;
type DecrementAction = Action<'DECREMENT'>;
type SetValueAction = Action<'SET_VALUE', number>;


// Example State
interface CounterState {
  value: number;
}

// Example Reducer
const counterReducer: Reducer = (
  state: CounterState,
  action: IncrementAction | DecrementAction | SetValueAction
): CounterState => {
  switch (action.type) {
    case 'INCREMENT':
      return { ...state, value: state.value + 1 };
    case 'DECREMENT':
      return { ...state, value: state.value - 1 };
    case 'SET_VALUE':
      return { ...state, value: action.payload };
    default:
      return state;
  }
};

// Usage
const initialState: CounterState = { value: 0 };
const newState1 = counterReducer(initialState, { type: 'INCREMENT' }); // newState1.value is 1
const newState2 = counterReducer(newState1, { type: 'SET_VALUE', payload: 10 }); // newState2.value is 10

            

              
                Copy
              
            
          

            type ApiResponse = {
  status: number;
  data: T;
  message?: string;
};

type ExtractDataType = T extends ApiResponse ? U : never;

// Example API Response
type User = {
  id: number;
  name: string;
  email: string;
};

type UserApiResponse = ApiResponse;

type ExtractedUser = ExtractDataType; // type ExtractedUser = User

            

              
                Copy
              
            
          

            type AddressFormat = CountryCode extends 'US'
    ? { street: string; city: string; state: string; zipCode: string; }
    : CountryCode extends 'CA'
    ? { street: string; city: string; province: string; postalCode: string; }
    : { addressLines: string[]; city: string; country: string; };

type UserProfile = {
    id: number;
    name: string;
    email: string;
    address: AddressFormat;
    countryCode: CountryCode; // Add country code to profile
};

// Example Usage
type USUserProfile = UserProfile<'US'>; // Has US address format
type CAUserProfile = UserProfile<'CA'>; // Has Canadian address format
type GenericUserProfile = UserProfile<'DE'>; // Has Generic (international) address format

            

              
                Copy